import React from "react";
import { useLocation } from "react-router-dom";
import { HomeListItem } from "../home/homeSlice";
import { addCar } from "../../app/module/car/carSlice";
import { useAppDispatch } from "../../app/hooks";
const Index = () => {
  const location = useLocation();
  const state = location.state as HomeListItem;
  const dispatch = useAppDispatch();
  return (
    <div>
      <div>
        <img src={state.url} alt="" width="100%" />
        <h3>{state.title}</h3>
        <p>{state.desc}</p>
        <b style={{ color: "red" }}>{state.price}</b>
      </div>
      <button onClick={() => dispatch(addCar(state))}>加入购物车</button>
    </div>
  );
};

export default Index;
